import {createMemoryHistory, createRouter, createWebHistory} from 'vue-router'

import Home from '@/pages/Home.vue'
import News from '@/pages/News.vue'
import Detail from '@/pages/Detail.vue'


// 创建路由器
const router = createRouter({
    routes:[
        {
            name:'root',
            path:'/',
            redirect:'/home'
        },
        {
            name:'home',
            path:'/home',
            component: Home
        },
        {
            name:'about',
            path:'/about',
            component:()=>import('@/pages/About.vue')
        },
        {
            name:'news',
            path:'/news',
            component:News,
            children:[
                {   
                    name:'detail',
                    path:'detail/:id?/:title?/:content?',
                    // path:'detail/:id',
                    component:Detail,
                    // 第一种写法 将路由收到的所有params参数作为props传给组件
                    // props:true
                    // 第二种写法,手动决定传什么给props
                    props(route){
                        console.log(route);
                        return route.params
                    }
                    // 第三种写法
                    // props:{
                    //     id: 1,
                    //     title: 2,
                    //     content: 3
                    // }
                }
            ]
        }
        
    ],
    history:import.meta.env.SSR ? createMemoryHistory() : createWebHistory()
    
})
export default router